enyo.kind({
    name: "MyApps.Stores",
    kind: enyo.VFlexBox,
    events: {
        onBack: "",
    },
    components: [    /**
     * service
     */
    {
        name: "getData",
        kind: "WebService",
        url: "http://golfplus.mobile2you.fr/shops.json",
        onSuccess: "gotData",
        onFailure: "gotDataFailure"
    },    /**
     * Layout
     */
    {
        name: "pane0",
        kind: "Pane",
        flex: 1,
        transitionKind: "enyo.transitions.LeftRightFlyin",
        components: [{
            kind: "VFlexBox",
            components: [{
                kind: "PageHeader",
                className: "enyo-header-dark",
                components: [{
                    kind: "IconButton",
                    onclick: "doBack",
                    icon: "images/menu-icon-back.png",
                    className: "enyo-button-dark"
                }, {
                    kind: "VFlexBox",
                    flex: 1,
                    align: "center",
                    components: [{
                        content: "Magasins"
                    }, ]
                }, {
                    name: "switchButton",
                    kind: "Button",
                    onclick: "changeView",
                    caption: "Liste",
                    className: "enyo-button-dark"
                }, ]
            }, {
                name: "pane",
                kind: "Pane",
                flex: 1,
                components: [{
                    name: "storesMap",
                    kind: "MyApps.StoresMap",
                    lazy: true,
                
                }, {
                    name: "storesList",
                    kind: "MyApps.StoresList",
                    lazy: true,
                    onDetailSelect: "detailSelected",
                }, ]
            }, ]
        }, {
            name: "storeDetail",
            kind: "MyApps.StoreDetail",
            onBack: "goBack",
            lazy: true,
        
        }, ]
    }, ],
    
    
    
    create: function(){
        this.inherited(arguments);
        this.data = [];
        this.$.getData.call();
        this.$.pane.selectViewByName("storesMap");
    },
    gotData: function(inSender, inResponse){
        this.data = inResponse;
        this.$.storesMap.showOnMap(this.data);
    },
    gotDataFailure: function(inSender, inResponse){
        console.log("got failure from getData");
    },
    goBack: function(inSender, inEvent){
        this.$.pane0.back(inEvent);
    },
    changeView: function(){
        if (this.$.pane.getViewName() == "storesMap") {
            this.$.pane.selectViewByName("storesList");
            this.$.switchButton.setCaption("Carte");
            this.$.storesList.setData(this.data);
        }
        else 
            if (this.$.pane.getViewName() == "storesList") {
                this.$.pane.selectViewByName("storesMap");
                this.$.storesMap.showOnMap(this.data);
                this.$.switchButton.setCaption("Liste");
            }
    },
    
    detailSelected: function(inSender, inStoreid){
        this.$.pane0.selectViewByName("storeDetail");
        this.$.storeDetail.setStoreId(inStoreid);
    },

});



